* {
    margin:0;
    padding:0;
}
li {
    list-style: none;
}
.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
.head{
    display: flex;
    .px2rem(height, 90);
    .px2rem(line-height, 90);
    text-align: center;
    background: #7e4c81;
    color: white;  
    .left{
        width: 15%;
        display: flex;
        justify-content: center;
        align-items: center;
        img{
            width: 40%;
            .px2rem(height, 50);
        }
    }
    .center{
        flex: 1; 
        .px2rem(font-size, 30);
    }
    .right{
        img {
             // width: 15%; 
             // .px2rem(height, 90);
        }
       
    }
}
.content {
    width: 94%;
    border:1px solid #ccc;
    border-radius: 10px;
    .px2rem(height, 826);
    .px2rem(font-size, 32);
    margin: 20px auto;
    .top {
        display: flex;
            justify-content:space-between;
            align-items:center;
           background: #bcbbbb;
           .px2rem(height, 87);
           .px2rem(padding-left, 36);
           .px2rem(padding-right, 108);
           color: #fff;
    }
    ul {
        li {
            .px2rem(height, 82);
            display: flex;
            justify-content:space-between;
            align-items:center;
             .px2rem(padding-left, 36);
           .px2rem(padding-right, 32);
            p {

            }
            p:nth-child(2) {
                width: 52%;
                display: flex;
                justify-content:center;
                align-items:center;
            }
        }
       
        li:nth-child(2) {
            p:nth-child(3) {
                color: #f94627;
            }           
        }
        li:nth-child(4) {
            p:nth-child(3) {
                color: #58b5e1;
            }           
        }
        li:nth-child(9) {
            p:nth-child(3) {
                color: #f94627;
            }           
        }
        li:nth-child(odd) {
            background: #f1f1f1;
        }
    }
}
footer {
    width: 100%;
    .px2rem(height,78);
    border:1px solid #ccc;
    position: absolute;
    bottom: 0;
    left: 0;
    .footerTop {
        ul {
            display: flex;           
            li {
                flex:1;
                .px2rem(height,4);
            }
             li:nth-child(1) {
                    background: #e6eb91;
                } 
                li:nth-child(2) {
                    background: #ffaf56;
                } 
                li:nth-child(3) {
                    background: #fe7668;
                } 
                li:nth-child(4) {
                    background: #de3657;
                }
        }
    }
    .footerBottom {
        
        background: #36293f;
        ul {
            .px2rem(height,74);
             display: flex;
             justify-content:center;
             align-items:center;
             li:nth-child(2) {
                .px2rem(padding-left,20);
                .px2rem(padding-right,20);
             }
        }
       
    }
}